<template>
    <div @click="onAddress()" class="rc_left">
        <div class="rc_bg">
          <p>SEER</p>
          <p>NAME</p>
          <p>SERVICE</p>
          <h5 :title="title+'.web3'">{{title+'.web3'}}</h5>
        </div>
        <div class="flex">
          <p :title="title+'.web3'">{{title+'.web3'}}</p>
          <div @click.stop="onStar()" :class="{'star':true,'ups':star}"></div>
        </div>
      </div>
</template>

<script>
import { ElMessage } from 'element-plus'
export default {
    props:['title','disable'],
    data(){
        return{
            star:false,
            starArr:[],
            index:null
        };
    },
    mounted(){
        this.init()
    },
    methods:{
        init(){
            this.starArr = JSON.parse(localStorage.getItem('star'))   || []
            console.log(this.starArr)
            if(this.starArr && this.starArr.length > 0){
                
                for(let i=0;i<this.starArr.length;i++){
                    // console.log(this.starArr[i].name,'==',this.title)
                    if(this.starArr[i].name == this.title){
                        this.star = true;
                        this.index = i
                        console.log('初始化索引',this.index)
                        return
                    }
                }
            }
        },
        onStar(){
            this.init()
            console.log('索引',this.index)
            if(this.index != null){
                if(this.star){
                    this.star = false
                    this.starArr.splice(this.index, 1)
                    this.index = null
                    console.log('数组this.starArr')
                    console.log(JSON.stringify(this.starArr))
                    localStorage.setItem('star',JSON.stringify(this.starArr))
                    ElMessage.success('Cancel collection')
                }
            }else{
                if(!this.star){
                    this.star = true
                    this.starArr.push({name:this.title,star:this.star})
                    localStorage.setItem('star',JSON.stringify(this.starArr))
                    console.log('数组this.starArr')
                    console.log(JSON.stringify(this.starArr))
                    ElMessage.success('Collection of success')
                }
            }
        },
        onAddress(){
            if(this.disable) return;
            this.$router.push({path:'/address',query: {title:this.title}})
        },
    },
}
</script>


<style lang="less" scoped>
  
</style>
